Microsoft Technologies Custom Web Part এবং Extensions তৈরি করা গাইড ও নোট

298

SharePoint এ Custom Web Part এবং Extensions তৈরি করার মাধ্যমে আপনি আপনার SharePoint সাইটে নতুন ফিচার যোগ করতে পারেন এবং সাইটের কার্যক্ষমতা বাড়াতে পারেন। এই কাস্টম উপাদানগুলি বিশেষভাবে আপনার প্রয়োজন অনুযায়ী তৈরি করা হয় এবং SharePoint এর ব্যাকএন্ড বা ফ্রন্টএন্ডের সাথে সংযুক্ত থাকে। SharePoint Framework (SPFx) ব্যবহার করে Custom Web Part এবং Extensions তৈরি করা যায়, যা একটি আধুনিক, স্পষ্ট এবং ব্যবহারে সহজ পদ্ধতি।


Custom Web Part তৈরি করা

Custom Web Part হচ্ছে একটি কাস্টমাইজড SharePoint উপাদান যা আপনার সাইটে ডাটা প্রদর্শন করতে, ইউজার ইন্টারফেস তৈরি করতে, অথবা কোনো স্পেসিফিক ফাংশনালিটি যুক্ত করতে ব্যবহৃত হয়। Web Parts সাধারণত একটি ছোট কোড ফ্র্যাগমেন্ট হিসেবে কাজ করে এবং SharePoint সাইটে ডায়নামিক কনটেন্ট প্রদান করে।

Custom Web Part তৈরি করার প্রক্রিয়া

  1. SharePoint Framework (SPFx) সেটআপ: Custom Web Part তৈরি করতে প্রথমে SharePoint Framework (SPFx) সেটআপ করতে হবে। SPFx হল একটি ক্লায়েন্ট-সাইড ফ্রেমওয়ার্ক যা আপনাকে modern SharePoint সাইটের জন্য কাস্টম Web Parts তৈরি করতে সহায়তা করে। SPFx ব্যবহার করতে Node.js, Yeoman এবং Gulp টুলস ইনস্টল করা থাকতে হবে।
  2. নতুন Web Part তৈরি করা: Yeoman Generator ব্যবহার করে একটি নতুন SPFx Web Part তৈরি করুন। Yeoman একটি স্ক্যাফোল্ডিং টুল, যা SharePoint Web Part তৈরি করার জন্য প্রোজেক্টের স্ট্রাকচার জেনারেট করে।

    কমান্ড:

    yo @microsoft/sharepoint
    

    এরপর, নির্দেশাবলী অনুসরণ করে Web Part এর নাম, ধরণ এবং অন্যান্য কনফিগারেশন সেট করুন।

  3. Web Part কোড লেখা: Web Part তৈরি হওয়ার পর, আপনি JavaScript (React, Angular, বা অন্য কোনো লাইব্রেরি) বা TypeScript ব্যবহার করে আপনার কাস্টম Web Part এর কোড লিখতে পারেন। এখানে আপনি ডেটা এক্সেস, কনটেন্ট প্রদর্শন, ইন্টারঅ্যাকটিভ ফিচার যোগ করতে পারেন।

    উদাহরণস্বরূপ, একটি সিম্পল React Web Part এর কোড:

    import * as React from 'react';
    import { IHelloWorldProps } from './IHelloWorldProps';
    
    const HelloWorld: React.FC<IHelloWorldProps> = (props) => {
      return (
        <div>
          <h1>Hello, {props.description}!</h1>
        </div>
      );
    }
    
    export default HelloWorld;
    
  4. Web Part ডিপ্লয় এবং টেস্টিং: Web Part তৈরি করার পর, আপনি এটি SharePoint Online বা On-Premises সাইটে ডিপ্লয় করতে পারবেন। Gulp Serve ব্যবহার করে আপনি লোগাল সার্ভারে ডেভেলপমেন্ট এবং টেস্টিং করতে পারবেন।

    কমান্ড:

    gulp serve
    
  5. Web Part ডিপ্লয় করা: Web Part তৈরি হয়ে গেলে, এটি একটি SharePoint App Catalog এ ডিপ্লয় করুন। এরপর, SharePoint সাইটে গিয়ে সেই Web Part আপনার পেজে অ্যাড করতে পারবেন।

Extensions তৈরি করা

Extensions হলো কাস্টম ইউজার ইন্টারফেস এবং ফাংশনালিটি যুক্ত করার জন্য SharePoint সাইটে ব্যবহৃত উপাদান। SharePoint Extensions ব্যবহৃত হয় সাইটের কনটেক্সটে পরিবর্তন আনার জন্য, যেমন মেনু আইটেম, সাইট অ্যাকশন, বা টুলবার কাস্টমাইজেশন।

SharePoint Extension-এর ধরন

  1. Application Customizer: Application Customizer এর মাধ্যমে আপনি SharePoint সাইটে কাস্টম হেডার, ফুটার, বা অন্যান্য সাধারণ UI উপাদান যোগ করতে পারেন। উদাহরণস্বরূপ, একটি কাস্টম হেডার বা নোটিফিকেশন বার তৈরি করা।
  2. Field Customizer: Field Customizer ব্যবহার করে আপনি SharePoint লিস্ট ফিল্ডের কাস্টম ভিউ তৈরি করতে পারেন। এটি SharePoint List এর একটি নির্দিষ্ট কলাম বা ফিল্ডের UI কাস্টমাইজেশন করে।
  3. Command Set: Command Set ব্যবহার করে SharePoint সাইটের কাস্টম মেনু আইটেম এবং টুলবার বাটন তৈরি করা যায়। এটি আপনাকে ডকুমেন্ট লাইব্রেরি বা লিস্টের জন্য কাস্টম মেনু অ্যাকশন যোগ করতে দেয়।

Extension তৈরি করার প্রক্রিয়া

  1. Extension তৈরি করা: SPFx Extension তৈরি করতে Yeoman Generator ব্যবহার করতে হবে। Command Set বা Application Customizer তৈরি করার জন্য আপনি নির্দিষ্ট টেমপ্লেট নির্বাচন করতে পারেন।

    কমান্ড:

    yo @microsoft/sharepoint
    
  2. Extension কোড লেখা: একটি Extension তৈরি হওয়ার পর, আপনি JavaScript বা TypeScript ব্যবহার করে সেই Extension এর কাস্টম লজিক এবং UI ডেভেলপ করবেন। উদাহরণস্বরূপ, Application Customizer এর জন্য একটি কোড:

    import * as React from 'react';
    import { IApplicationCustomizerContext } from '@microsoft/sp-application-base';
    
    export default class ApplicationCustomizer extends React.Component<IApplicationCustomizerContext> {
      public render(): React.ReactElement<{}> {
        return (
          <div>
            <h1>Welcome to my custom header!</h1>
          </div>
        );
      }
    }
    
  3. Extension ডিপ্লয় এবং টেস্টিং: Extension তৈরি করার পর, আপনি এটি SharePoint App Catalog-এ আপলোড করে SharePoint সাইটে ডিপ্লয় করতে পারবেন।

Custom Web Part এবং Extensions এর সুবিধা

  • Customization: Custom Web Part এবং Extensions ব্যবহার করে আপনি SharePoint সাইটে আপনার নিজস্ব কনটেন্ট এবং ফিচার যোগ করতে পারেন।
  • Enhanced User Experience: কাস্টম Web Parts এবং Extensions এর মাধ্যমে ইউজারদের জন্য আরও ইন্টারঅ্যাকটিভ এবং কাস্টমাইজড ইউজার ইন্টারফেস তৈরি করা যায়।
  • Integration: আপনি সহজে SharePoint সাইটে অন্যান্য অ্যাপ্লিকেশন, ডেটাবেস, বা সার্ভিসের সাথে ইন্টিগ্রেটেড ফিচার যোগ করতে পারেন।
  • Scalability: SPFx Web Parts এবং Extensions স্কেলেবল হয়, যা বড় সিস্টেম বা অর্গানাইজেশনগুলোর জন্য উপযুক্ত।

Custom Web Part এবং Extensions তৈরি করার মাধ্যমে আপনি SharePoint সাইটে নতুন ফিচার, কাস্টমাইজড ইউজার ইন্টারফেস এবং ডেটা ম্যানিপুলেশন ক্ষমতা যোগ করতে পারবেন। SPFx এর মাধ্যমে এগুলি করার সুবিধা হলো, এটি modern SharePoint সাইটে একীভূত এবং ব্যবহারে সহজ।

Content added By
Promotion

Are you sure to start over?

Loading...